<template>
  <div>
    <DraggableWindowVideo @data-updated="handleDataUpdate"/>
    <DraggableWindow :data="dataFromVideo" :initialTop="200" :initialLeft="1450" :initialWidth="350"
      :initialHeight="600" :initialImageSrc="require('@/assets/logo.png')" />
  </div>
</template>

<script>
  import DraggableWindowVideo from './DraggableWindowVideo.vue';
  import DraggableWindow from './DraggableWindow.vue';

  export default {
    components: {
      DraggableWindowVideo,
      DraggableWindow
    },
    data() {
      return {
        dataFromVideo: '[[0, 0, 0], [0, 0, 0], [0, 0, 0]]'
      };
    },
    methods: {
      handleDataUpdate(newData) {
        this.dataFromVideo = newData;
        // console.log(this.dataFromVideo);
      },
    }
  };
</script>
